<template>
	<!-- 轮播图 -->
	<view class="swiper-home">
		<swiper 
		:indicator-dots="true" 
		:autoplay="true" 
		:interval="3000" 
		:duration="1000" 
		circular="true" 
		class="swiper"
		indicator-color="#FFFFFF"
		indicator-active-color="#0C34BA">
			<swiper-item v-for="(item,index) in bannerList ":key="index">
				<view class="swiper-item"><image :src="item.bannerImg" mode="widthFix"></image></view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script>
	export default {
		props:{
			bannerList:Array
		},
		data() {
			return {
			}
		},
		onLoad() {
			
		}
	}
</script>

<style scoped>
	.swiper-home{
		z-index: 1;
	}
	.swiper{
		margin-top:20rpx;
		height: 520rpx;
		border: 2rpx solid #ffffff;
		border-radius: 15rpx;
		overflow: hidden;
	}
	.swiper-item{
		width: 100%;
		height: 100%;
	}
	.swiper-item>image{
		/* height: 520rpx; */
		width: 100%;
		height: 100%;
	}
	/deep/ .uni-swiper-dot{
		width: 30rpx;
		border-radius: 1rpx;
		height: 8rpx;
	}
	/deep/ .uni-swiper-dots{
		left: 80%;
	}
</style>
